<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>积木纵横后台管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="__SKIN__/js/layui/css/layui.css" media="all">
    <!--JS引用-->
    <script src="__SKIN__/js/jquery/jquery-3.3.1.js"></script>
    <script src="__SKIN__/js/layui/xm-select.js"></script>
    <!--CSS引用-->
    <link rel="stylesheet" href="__SKIN__/js/layui/css/layui.css" />
</head>
<body>

<div class="layui">
            <div class="layui-inline">
                <div id="examine">
                    <div style="width:800px">
                        <div style="width:90%;margin-left:5%;" class="layui-form" lay-filter="exform" id="exform"></div>
                    </div>
                </div>
                <!--下载操作菜单-->
                <script type="text/html" id="down">
                    <a class="layui-btn layui-btn-xs"  lay-event="down">下载</a>
                </script>
                <script type="text/html" id="downs">
                    <a class="layui-btn layui-btn-xs"  lay-event="down">下载</a>
                    <a class="layui-btn layui-btn-danger layui-btn-xs"  lay-event="del">删除</a>
                </script>
                <!--下载操作菜单end-->
            </div>
        <!--内容容器end-->
    </div>
</div>
<script src="__SKIN__/workflow/js/form_assembly.js" charset="utf-8"></script>
<script src="__SKIN__/js/layui/layui.js"></script>
<script>

    //同步ajax请求数据转出
    var ajax = function(url,data){
        var arr = {};
        $.ajax({
            url:url,
            type:'post',
            data:data,
            dataType:"html",
            async: false,//关闭异步
            success:function(e){
                arr = eval('(' + e + ')');
            }
        });
        return arr;
    }


    /**************************layui实例化结束*************************/
    var layui = layui.use(['table','form','layer','upload','element'], function(){
        var $ = layui.$
            ,table = layui.table
            ,upload = layui.upload
            ,layer = layui.layer
            ,form = layui.form;

            /************************************多文件列表示例*********************************/


            /****************************打回监听*****************************/

            var repulse = function(e){
                let repulse_url = "{:url('Workflowajax/to_examine_workflow')}";
                let ex_data = form.val('exform');
                // layer.msg(workflow_id);
                ex_data.type = e;
                var count = 0;
                for(var p in ex_data){
                    count++;
                }
                ex_data.length=count;
                let res = ajax(repulse_url,ex_data);
                layer.msg(res.msg,{
                    icon: 1,
                    time: 2000 //2秒关闭（如果不配置，默认是3秒）
                },function(){
                    layer.closeAll();
                });
                var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                parent.layer.close(index); //再执行关闭
                // layer.closeAll();
                // table.reload('workflow2');
            }

            $(document).on('click','#repulse_previous',function(){
                repulse('previous');
            });
            $(document).on('click','#repulse_first',function(){
                repulse('first');
            });
            $(document).on('click','#repulse_next',function(){
                repulse('next');
            });
            //自动初始化审核页面
            layer.ready(function(){
                var heads = top.workflow;  //主页面传来的数据
                    let url = "{:url('Workflowajax/get_workflow_form_data')}";
                    let data = ajax(url,{'worlflow_id':heads.id});
                    console.log(heads);

                    if(heads.auto_create==10){
                        var html = loadflows(data.data,'examine');
                    }else{
                        if(heads.is_form_extend == 0 || heads.is_form_extend == undefined || heads.is_form_extend == null){
                            var html = loadflow(data.data,'examine');
                        }else{
                            var html = loadflows(data.data,'examine');
                        }
                    }
                    $('#exform').html(html);
                    form.render();
                    if(data.data.downlist != undefined){
                        downlist(data.data.downlist,'examine');
                    }
                    table.reload('down_list');
                    if(data.data.msg.is_upload==1) {
                        demoListView();
                    }
                    upload.render();
                    let form_data = data.data.form_data;
                    form.val('exform',
                        form_data
                    );
                    form.render();

            });
        var active = {
            url_button:function(){
                //获取链接参数
                var heads = top.workflow;
                var urls ='../'+heads.index+'?type='+heads.details+'&id='+heads.form_extend;
                top.type='examine';
                _this = layer.open({
                    type: 2//此处以iframe举例
                    ,title: '发起'
                    ,area: 'auto'
                    ,shade: 0
                    ,maxmin: true
                    ,offset: 'auto'
                    ,content: urls
                    ,btn: [ '关闭']
                    ,btn1: function(index, layero){
                        layer.close(index);
                        return false;
                    },
                    cancel: function(layero,index){
                        layer.closeAll();
                    },
                    end:function(){
                        form_extend = top.form_extend;
                        let edit_url = "{:url('Workflowajax/edit_workflow')}";
                        let res = ajax(edit_url,{'workflow_id':data.id});
                        table.reload('workflow');
                        return false;
                    }
                });
                layer.full(_this); //窗口直接顶天立地
            },
            setflow:function(id){ //配置流程模板
                //获取参数
                _this = layer.open({
                    type: 2//此处以iframe举例
                    ,title: '设置流程模板'
                    ,area: 'auto'
                    ,shade: 0
                    ,maxmin: true
                    ,offset: 'auto'
                    ,content: '../'+add_config['form_url']
                    ,btn: [ '关闭']
                    ,btn1: function(index, layero){
                        layer.close(index);
                        return false;
                    },
                    cancel: function(layero,index){
                        layer.closeAll();
                    }
                });
                layer.full(_this); //窗口直接顶天立地
            }
        }
        //弹窗表单按钮控制器
        $('#extra .layui-btn').on('click', function(){
            var othis = $(this), method = othis.data('method');
            active[method] ? active[method].call(this, othis) : '';
        });

        table.on('tool(down_list)', function(obj){
            var data = obj.data;
            if(obj.event === 'down'){
                let url = "{:url('Workflowajax/download')}?id="+data.id;
                window.location.href = url;
            }else if(obj.event === 'del'){
                layer.confirm('真的删除记录么？', function(index){
                    let url = "{:url('Workflowajax/down_list_del')}";
                    let res = ajax(url,{'id':data.id})
                    if(res.code == 1){
                        layer.msg(res.msg, {
                            time: 3000, //20s后自动关闭
                        });
                        obj.del();
                    }else{
                        layer.msg(res.msg, {
                            time: 3000, //20s后自动关闭
                        })
                    }
                });
            }
        });

        });



    var downlist = function(e,type){
            if(type == 'examine'){
                layui.table.render({
                    elem: '#down_list'
                    ,auto: false
                    , cols:[[
                        {field: 'id', title: 'id',cellMinWidth:80,  sort: true}
                        , {field: 'name', title: '文件名', sort: true}
                        , {field: 'username', title: '归属人', }
                        , {field: 'format', title: '文件类型', }
                        , {field: 'folder', title: '所在目录',  sort: true}
                        , {fixed: 'right',title:'操作',toolbar: '#down', fixed:'right'}
                    ]]
                    ,data:e
                });
            }else if(type == 'edit'){
                layui.table.render({
                    elem: '#down_list'
                    ,auto: false
                    , cols:[[
                        {field: 'id', title: 'id',cellMinWidth:100,  sort: true, templet:function(i){
                                return i.id+'<input type="hidden" name="file_id[]" value="'+i.id+'"></input>';
                            }}
                        , {field: 'name', title: '文件名', sort: true}
                        , {field: 'username', title: '归属人', }
                        , {field: 'format', title: '文件类型', }
                        , {field: 'folder', title: '所在目录',  sort: true}
                        , {fixed: 'right',title:'操作',toolbar: '#downs',fixed:'right'}
                    ]]
                    ,data:e
                });
            }
        }

    /*******************************上传方法******************************/
    var demoListView = function(){
        let object = $('#uploads'),uploadListIns = layui.upload.render({
            elem: '#testList'
            ,url: "{:url('Workflowajax/layui_upload')}"
            ,accept: 'file'
            ,multiple: true
            ,auto: false
            ,bindAction: '#testListAction'
            ,choose: function(obj){
                var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
                //读取本地文件
                obj.preview(function(index, file, result){
                    var tr = $(['<tr id="upload-'+ index +'">'
                        ,'<td>'+ file.name +'</td>'
                        ,'<td>'+ (file.size/1024).toFixed(1) +'kb</td>'
                        ,'<td>等待上传</td>'
                        ,'<td>'
                        ,'<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>'
                        ,'<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>'
                        ,'</td>'
                        ,'</tr>'].join(''));
                    //单个重传
                    tr.find('.demo-reload').on('click', function(){
                        obj.upload(index, file);
                    });

                    //删除
                    tr.find('.demo-delete').on('click', function(){
                        delete files[index]; //删除对应的文件
                        tr.remove();
                        uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
                    });

                    object.append(tr);
                });
            }
            ,done: function(res, index, upload){
                if(res.code==1){ //上传成功
                    var tr = object.find('tr#upload-'+ index)
                        ,tds = tr.children();
                    tds.eq(1).append('<input type="hidden" name="file_ids[]" value="'+res.data.file_id+'">');
                    tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
                    tds.eq(3).html(''); //清空操作
                    //回写文件ID

                    return delete this.files[index]; //删除文件队列已经上传成功的文件
                }
                this.error(index, upload);
            }
            ,error: function(index, upload){
                var tr = object.find('tr#upload-'+ index)
                    ,tds = tr.children();
                tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
                tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
            }
        });
    };
    /*******************************监听行工具事件（下载附件）*********************************/

    /***************************初始化表单方法**************************/
    var loadflow = function(res,type){
        var html = '';
        html+=loadhead(res.msg,type);
        html += loadline('审核表单');
        $.each(res.data,function(f,n){

            switch (n.field_type) {
                case 1:
                    html += loadtext(n);
                    break;
                case 2:
                    html += loadselect(n);
                    break;
                case 3:
                    html += loadradio(n);
                    break;
                case 4:
                    html += loadcheckbox(n);
                    break;
            }
        });
        //判断允许更改审核结构（审核人员，角色，部门）
        if(res.downlist !== undefined)
        {
            if (res.downlist.length > 0) {
                html += loadline('附件下载');
                html += down_list();
            }
        }

        if(res.msg.is_upload==1){
            html += loadline('附件上传');
            html += uploads();
        }

        if(res.msg.is_comment==1){
            html += loadline('留言评论');
            html += conmment();
        }

        html += loadline();
        html += loadbutton(res.process,type);

        return html;
    }
    var loadflows = function(res,type){
        var html = '';
        html += loadhead(res.msg,type);
        html += loadline('审核表单');
        html += url_button();
        //判断允许更改审核结构（审核人员，角色，部门）
        if(res.downlist !== undefined)
        {
            if (res.downlist.length > 0) {
                html += loadline('附件下载');
                html += down_list();
            }
        }

        if(res.msg.is_upload==1){
            html += loadline('附件上传');
            html += uploads();
        }

        if(res.msg.is_comment==1){
            html += loadline('留言评论');
            html += conmment();
        }

        html += loadline();
        html += loadbutton(res.process,type);

        return html;
    }
    /**
     * 外接表单按钮
     * @returns {string}
     */
    var url_button = function () {
        let html = "";
            html+='<div id="extra">';
            html+='<button type="button" data-method="url_button" class="layui-btn layui-btn-warm">点击查看外接表单</button>';
            html+='</div>';
            return html
        }




</script>

</body>